<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>搜索结果页</title>
    <link rel="stylesheet" href="../static/css/bootstrap.css">
    <link rel="stylesheet" href="../static/css/appointment.css">
    <link rel="stylesheet" href="../static/css/sweetalert.css">
    <link rel="stylesheet" href="../static/css/index.css">
    <script src="../static/js/jquery.js"></script>
    <script src="../static/js/bootstrap.js"></script>
    <script src="../static/js/sweeralert.min.js"></script>

    <!--<script src="js/index.js"></script>-->
</head>
<body>
<!-- 页面上的最上面导航 -->
<nav class="navbar navbar-default">
    <div class="navbar-header" style="margin-left: 50px;margin-top: -10px">
        <a href="/index/toIndex"><h3>家政服务系统</h3></a>
    </div>

    <div>
        <ul class="nav navbar-nav">
            <li>
                <a href="/index/toIndex">
                    <span class="glyphicon glyphicon-home"></span>
                    首页
                </a>
            </li>
            <li class="register">
                <a href="/user/toRegister">
                    <span class="glyphicon glyphicon-user"></span>
                    注册
                </a>
            </li>
            <li class="log-in">
                <a href= "/user/toLogin" >
                    <span class="glyphicon glyphicon-log-in"></span>
                    登录
                </a>
            </li>
            <li class="log-out">
                <a href= "/user/logout" >
                    <span class="glyphicon glyphicon-log-out"></span>
                    退出
                </a>
            </li>
            <li class="space">
                <a href="#">个人中心</a>
                <ul class="next-menu">
                    <li>
                        <a href="/person/toPerson">个人资料</a>
                    </li>
                    <li>
                        <a href="/order/toOrder">我的订单</a>
                    </li>
                    <li>
                        <a href="/app/toCmApp">我的预约</a>
                    </li>
                </ul>
            </li>
            <li class="space">
                <a href="#">家政人员中心</a>
                <ul class="next-menu">
                    <li>
                        <a href="/hk/toHkPerson">商家资料</a>
                    </li>
                    <li>
                        <a href="/app/toHkApp">预约列表</a>
                    </li>
                    <li>
                        <a href="/order/toHkOrder">我的订单</a>
                    </li>
                </ul>
            </li>
        </ul>
    </div>
</nav>
<div class="container" style="max-width: 800px">
    <!-- 筛选条件 -->
    <div class="clearfix filter">
        <ul class="select">
            <li class="select-list">
                <dl id="select2">
                    <dt>支付类型：</dt>
                    <dd class="select-all selected"><a href="#">全部</a></dd>
                    <dd><a href="#" class="settle" id="0">按单支付</a></dd>
                    <!--<dd>按单支付</dd>-->
                    <dd><a href="#" class="settle" id="1">按小时支付</a></dd>
                </dl>
            </li>
            <li class="select-list">
                <dl id="select3">
                    <dt>认证类型：</dt>
                    <dd class="select-all selected"><a href="#">全部</a></dd>
                    <dd><a href="#" class="type" id="single-type">个人认证</a></dd>
                    <dd><a href="#" class="type" id="company-type">公司认证</a></dd>
                </dl>
            </li>
            <li class="select-result">
                <dl>
                    <dt>已选条件：</dt>
                    <dd class="select-no">暂时没有选择过滤条件</dd>
                </dl>
            </li>
        </ul>
    </div>

    <!--家政人员列表项-->
    <div class="housekeeper-list clearfix">


    </div>
</div>
</body>
</html>
<script>

    var curWwwPath = window.location.href;
    var pathName = window.location.pathname;
    var ctx = curWwwPath.substring(0,curWwwPath.indexOf(pathName));

    <!-- 获取参数 -->
    var request = {
        QueryString : function(val) {
            var uri = window.location.search;
            var re = new RegExp("" +val+ "\=([^\&\?]*)", "ig");
            return ((uri.match(re))?(uri.match(re)[0].substr(val.length+1)):null);
        },
        QueryStrings : function() {
            var uri = window.location.search;
            var re = /\w*\=([^\&\?]*)/ig;
            var retval=[];
            while ((arr = re.exec(uri)) != null)
                retval.push(arr[0]);
            return retval;
        },
        setQuery : function(val1, val2) {
            var a = this.QueryStrings();
            var retval = "";
            var seted = false;
            var re = new RegExp("^" +val1+ "\=([^\&\?]*)$", "ig");
            for(var i=0; i<a.length; i++) {
                if (re.test(a[i])) {
                    seted = true;
                    a[i] = val1 +"="+ val2;
                }
            }
            retval = a.join("&");
            return "?" +retval+ (seted ? "" : (retval ? "&" : "") +val1+ "=" +val2);
        }
    }
    var typeid = request.QueryString("typeid");

    // 页面加载函数...
    $(document).ready(function () {
        filter();
        loadResult($(".housekeeper-list"), typeid);
        loginSuccess();
        filterResult($(".housekeeper-list"), typeid);
        $(".log-out").click(function () {
            logout();
        })
    })

    // 加载搜索结果
    function loadResult(container, param) {
        var url = ctx + "/result/loadSearchResult"
        var data = "param=" + param;
        $.ajax ({
            "url": url,
            "data": data,
            "dataType": "json",
            "type": "Post",
            "success": function (json) {
                if (json.state == 200) {
                    container.html("");
                    var list = json.data;
                    for (var i = 0; i < list.length; i ++) {
                        var optionData= "<div class=\"housekeeper-list-item clearfix\">\n" +
                            "<div class=\"col-md-3 headImg\">\n" +
                            "<img style='width: 100px; height: 100px;' src=\"#{hk_headPhoto}\" alt=\"家政人员照片\" class=\"img-rounded\">\n" +
                            "</div>\n" +
                            "<div class=\"col-md-6\">\n" +
                            "<div class=\"h4\">#{hk_Slogan}</div>\n" +
                            "<div>#{hk_hkDesc}</div>\n" +
                            "<div><a href=\"#\">#{hk_companyName}</a></div>\n" +
                            "<div>\n" +
                            // "<span class=\"badge\">金牌认证</span>\n" +
                            // "<span class=\"badge\">带娃能手</span>\n" +
                            "#{span_list}\n" +
                            "</div>\n" +
                            "</div>\n" +
                            "<div class=\"col-md-3\">\n" +
                            "<a href=\"toHouseKeeper?id=#{hk_id}\" class=\"btn btn-primary go-single\">进去看看</a>\n" +
                            "</div>\n" +
                            "</div>";
                        optionData = optionData.replace("#{hk_headPhoto}", list[i].hkHeadphoto);
                        optionData = optionData.replace("#{hk_id}", list[i].id);
                        optionData = optionData.replace("#{hk_hkDesc}", list[i].hkDesc);
                        optionData = optionData.replace("#{hk_Slogan}", list[i].hkSlogan);
                        optionData = optionData.replace("#{hk_companyName}", list[i].companyName);
                        optionData = optionData.replace("#{span_list}", getLabelList(list[i].hkLabel));
                        container.append(optionData);
                    }
                }
            }
        })
    }

    // 实现筛选
    function filterResult(container, id) {
        $(".select-list a").click(function () {
            if ($(this).text() == "全部") {
                loadResult($(".housekeeper-list"), typeid);
            } else {
                loadFilterResult(container, id, $(this).attr("id"));
            }
        })
    }

    function loadFilterResult(container, id, settle) {
        var url = ctx + "/result/loadSearchResult";
        var data = "param=" + id;
        $.ajax({
            "url": url,
            "data": data,
            "dataType": "json",
            "type": "Post",
            "success": function (json) {
                container.html("");
                if (json.state == 200) {
                    var list = json.data;
                    for (var i = 0; i < list.length; i ++) {
                        var optionData = "<div class=\"housekeeper-list-item clearfix\">\n" +
                            "<div class=\"col-md-3 headImg\">\n" +
                            "<img style='width: 100px; height: 100px;' src=\"#{hk_headPhoto}\" alt=\"家政人员照片\" class=\"img-rounded\">\n" +
                            "</div>\n" +
                            "<div class=\"col-md-6\">\n" +
                            "<div class=\"h4\">#{hk_Slogan}</div>\n" +
                            "<div>#{hk_hkDesc}</div>\n" +
                            "<div><a href=\"#\">#{hk_companyName}</a></div>\n" +
                            "<div>\n" +
                            // "<span class=\"badge\">金牌认证</span>\n" +
                            // "<span class=\"badge\">带娃能手</span>\n" +
                            "#{span_list}\n" +
                            "</div>\n" +
                            "</div>\n" +
                            "<div class=\"col-md-3\">\n" +
                            "<a href=\"/toSearchResult?typeId=#{hk_id}\" class=\"btn btn-primary go-single\">进去看看</a>\n" +
                            "</div>\n" +
                            "</div>";
                        if (list[i].hkSettle == settle) {
                            optionData = optionData.replace("#{hk_headPhoto}", list[i].hkHeadphoto);
                            optionData = optionData.replace("#{hk_id}", list[i].id);
                            optionData = optionData.replace("#{hk_hkDesc}", list[i].hkDesc);
                            optionData = optionData.replace("#{hk_Slogan}", list[i].hkSlogan);
                            optionData = optionData.replace("#{hk_companyName}", list[i].companyName);
                            optionData = optionData.replace("#{span_list}", getLabelList(list[i].hkLabel));
                            container.append(optionData);
                        }
                    }
                }
            }
        })
    }

    // 获取家政人员的徽章列表
    function getLabelList(str) {
        var result = "";
        var list = str.split("-");
        for (var i = 0; i < list.length; i ++) {
            var optionData = "<span class=\"badge\">"+ list[i] +"</span>";
            result += optionData;
        }
        return result;
    }

    // 登录成功
    function loginSuccess() {
        $(".log-out").css({"display": "none"});
        $.ajax({
            "url": ctx + "/user/loginSuccess",
            "type": "Post",
            "success": function (json) {
                if (json.state == 200) {
                    $(".log-out").css({"display": "block"});
                    $(".log-in").css({"display": "none"});
                    $(".register").css({"display": "none"});
                }else {
                    alert("请登录");
                    window.location.href = "/user/toLogin";
                }
            }
        })
    }

    // 退出系统
    function logout() {
        $.ajax ({
            "url": ctx + "/user/logout",
            "type": "Post",
            "success": function (json) {
                if (json.state == 200) {
                    alert("退出成功...");
                }
            }
        })
    }

    // 筛选条件的函数
    function filter() {
        $("#select2 dd").click(function () {
            $(this).addClass("selected").siblings().removeClass("selected");
            if ($(this).hasClass("select-all")) {
                $("#selectB").remove();
            } else {
                var copyThisB = $(this).clone();
                if ($("#selectB").length > 0) {
                    $("#selectB a").html($(this).text());
                } else {
                    $(".select-result dl").append(copyThisB.attr("id", "selectB"));
                }
            }
        });
        $("#select3 dd").click(function () {
            $(this).addClass("selected").siblings().removeClass("selected");
            if ($(this).hasClass("select-all")) {
                $("#selectC").remove();
            } else {
                var copyThisC = $(this).clone();
                if ($("#selectC").length > 0) {
                    $("#selectC a").html($(this).text());
                } else {
                    $(".select-result dl").append(copyThisC.attr("id", "selectC"));
                }
            }
        });
        $(".select dd").click(function () {
            if ($(".select-result dd").length > 1) {
                $(".select-no").hide();
            } else {
                $(".select-no").show();
            }
        });
    }


</script>